<template>
    <div class="address">
        <navtop :title="aid ? '编辑地址' : '新增地址'" :fixed="true" />
        <!-- <Navi :fixed="true" :title="aid ? '编辑地址' : '新增地址'" /> -->
        <div>
            <van-address-edit :area-list="areaList" :show-postal="showPostal" :show-delete="!!aid" show-set-default
                :area-columns-placeholder="['选择省', '选择市', '选择区/县']" :address-info="addressInfo" @save="save"
                @delete="deleteAddress" autocomplete="off" />
        </div>
    </div>
</template>

<script  lang="ts">
import { defineComponent, ref, onMounted } from 'vue'

import navtop from "@/components/navtop.vue"

import { areaList } from '@vant/area-data'



import { Toast, Dialog } from 'vant'

import { useRouter, useRoute } from "vue-router";

//postaddAddress
import { postaddAddress, posteditAddress, getfindAddressByAid, postdeleteAddress } from '@/api/index'

export default defineComponent({
    name: 'Address',
    components: {
        navtop
    },
    setup() {

        let router: any = useRouter();

        let route: any = useRoute();

        let areaListData: any = ref<any>(areaList);

        let showPostal: any = ref<boolean>(true);

        //地址的aid, 编辑地址需要使用
        let aid = ref<string>('');

        //地址数据
        let addressInfo: any = ref<any>({});

        //新增地址
        let addAddress: (content: any) => void = (content: any): void => {
            let addressInfo: any = { ...content }
            addressInfo.isDefault = Number(addressInfo.isDefault);
            // delete addressInfo.country;
            console.log(addressInfo)

            postaddAddress(addressInfo).then((result: any): void => {


                Toast(result.data.msg);

                if (result.data.code === 700) {

                    router.push({ name: 'Login' });
                    return;
                }

                if (result.data.code === 9000) {
                    setTimeout(() => {
                        router.go(-1);
                    }, 1000)
                }

            })
        }

        //编辑地址
        let editAddress: (content: any) => void = (content: any): void => {
            let addressInfoData = {
                ...content,
                aid: aid.value
            }

            // delete addressInfoData.country;

            //检测用户是否修改的地址数据
            let isModify: boolean = false;
            for (let key in addressInfoData) {
                if (addressInfoData[key] !== addressInfo.value[key]) {
                    isModify = true;

                }
            }

            if (!isModify) {
                Toast('尚未修改地址');
                return;
            }

            addressInfoData.isDefault = Number(addressInfoData.isDefault);

            posteditAddress({
                addressInfoData
            }).then((result: any): void => {


                Toast(result.data.msg);

                if (result.data.code === 700) {

                    router.push({ name: 'Login' });
                    return;
                }

                if (result.data.code === 30000) {
                    setTimeout(() => {
                        router.go(-1);
                    }, 1000)
                }

            })
        }

        //保存地址
        let save: (content: any) => void = (content: any): void => {
            if (aid.value) {
                //编辑地址
                editAddress(content);
            } else {
                //新增地址
                addAddress(content);
            }

        }

        //根据aid获取地址数据
        let getAddressByAid: () => void = (): void => {
            console.log(aid);

            getfindAddressByAid({
                aid: aid.value
            }).then((result: any): void => {


                if (result.data.code === 700) {
                    Toast(result.data.msg);
                    router.push({ name: 'Login' });
                    return;
                }

                if (result.data.code === 40000) {
                    let data = result.data.result[0];
                    data.isDefault = Boolean(data.isDefault);
                    addressInfo.value = data;
                }

            })
        }

        //删除地址
        let deleteAddress: () => void = (): void => {

            Dialog
                .confirm({
                    title: "删除地址",
                    message: "是否确认删除！",
                    confirmButtonColor: "#0C34BA",
                }).then((): void => {
                    postdeleteAddress({

                        aid: aid.value

                    }).then((result: any): void => {


                        Toast(result.data.msg);

                        if (result.data.code === 700) {

                            router.push({ name: 'Login' });
                            return;
                        }

                        if (result.data.code === 10000) {
                            setTimeout(() => {
                                router.go(-1);
                            }, 1000)

                        }

                    })
                })


        }


        onMounted(() => {
            //获取查询参数aid
            aid.value = route.query.aid;
            if (aid.value) {
                getAddressByAid();
            }
        })

        return {
            areaList: areaListData,
            showPostal,
            aid,
            addressInfo,
            save,
            deleteAddress
        };

    }
})
</script>

<style lang="less" scoped>
.address {
    padding-top: 46px;

    :deep(.van-switch--on) {
        background-color: #0C34BA;
    }

    :deep(.van-button--danger) {
        background-color: #0C34BA;
        border-color: #0C34BA;
    }
}
</style>